<template>
  <div class="hello">
    <el-form>
      <el-upload
        ref="uploadtcpmm"
        class="upload-demo"
        drag
        :on-change="onUploadChange"
        :on-exceed="onExceed"
        :auto-upload="false"
        action="/upload2"
        :limit="1"
        :data="mmextraData"
        :file-list="fileList"
        accept="application/vnd.android.package-archive"
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将MM拖到此处，或
          <em>点击选择</em>
        </div>
        <div class="el-upload__tip" slot="tip"></div>
      </el-upload>
      <el-upload
        ref="upload"
        class="upload-demo"
        drag
        :on-change="onUploadChange"
        :on-exceed="onExceed"
        :auto-upload="false"
        action="/upload2"
        :limit="1"
        :data="extraData"
        :file-list="fileList"
        accept="application/vnd.android.package-archive"
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将目标APK文件拖到此处，或
          <em>点击选择</em>
        </div>
        <div class="el-upload__tip" slot="tip"></div>
      </el-upload>

      <el-button :disabled="submitDisabled" type="primary" @click="onSubmit">立即创建</el-button>

      <el-table :data="bindinfo" border style="width: 100%">
        <el-table-column prop="pkg" sortable　label="包名"></el-table-column>
        <el-table-column prop="appname" sortable label="应用名"></el-table-column>
        <el-table-column prop="vername" sortable label="版本号"></el-table-column>
        <el-table-column fixed="right" label="操作" prop="downloadpath">
          <template slot-scope="scope">
            <el-button @click="handleClicktable(scope.row)" size="mini">下载</el-button>
            <el-button type="danger" @click.native.prevent="deleteRow(scope.$index, bindinfo)" size="mini">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "BindTcpmm",
  data() {
    return {
      bindinfo: [],
      fileList: [],
      submitDisabled: true,
      extraData: {
        package: "",
        versionCode: "",
        versionName: "",
        type:"tcpmmapk",
        ip:'',
        remark:'',
        mmname:''
      },
      mmextraData:{
        type:"tcpmm"
      },
      apkinfo: {},
      loading: null,
      step:0
    };
  },
  methods: {
    step2(mmname){
      this.extraData.package = this.apkinfo.package;
      this.extraData.versionCode = this.apkinfo.versionCode;
      this.extraData.versionName = this.apkinfo.versionName;
      this.extraData.mmname = mmname
      console.log("ip=" + this.extraData.ip);
      console.log("remark=" + this.extraData.remark);
      this.$refs.upload.submit();
    },
    deleteRow(index, rows) {
      rows.splice(index, 1);
    },
    handleClicktable(row) {
      console.log(row);
      window.open("/" + row.downloadpath);
    },
    fetchbindresult() {
      this.$axios
        .get("/getapk", {
          params: {
            ip: this.extraData.ip,
            remark: this.extraData.remark,
            pkgname: this.extraData.package,
            vercode: this.extraData.versionCode,
            vername: this.extraData.versionName
          }
        })
        .then(res => {
          console.log("resdata=============", res.data);
          if (res.data.code === "0") {
            this.loading.close();
            this.bindinfo.push({
              pkg: this.extraData.package,
              appname: this.apkinfo.application.label[0],
              vername: this.extraData.versionName + '_' + this.extraData.versionCode,
              downloadpath: res.data.content,
              ip: this.extraData.ip,
              remark: this.extraData.remark
            });
          } else if (res.data.code === 1) {
            setTimeout(this.fetchbindresult, 2000);
          } else {
            this.loading.close();
          }
        });
    },
    onSubmit() {
      this.$refs.uploadtcpmm.submit();
      if (this.loading) this.loading.close();
      this.loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
    },
    onExceed(files, fileList) {
      alert("too many files");
    },
    onUploadChange(file) {
      if (file.status === "ready") {
        const AppInfoParser = require("app-info-parser");
        const parser = new AppInfoParser(file.raw); // or xxx.ipa
        parser
          .parse()
          .then(result => {
            this.submitDisabled = false;
            this.apkinfo = result;
            console.log("app info ----> ", result);
          })
          .catch(err => {
            console.log("err ----> ", err);
          });
      } else if (file.status === "success") {
        this.submitDisabled = true;
        if(this.step == 0){
          this.$refs.uploadtcpmm.clearFiles();
          this.step2(file.response.filename)
          this.step = 1;
        }else{
          this.$refs.upload.clearFiles();
          this.fetchbindresult();
          this.step = 0;
        }
      }
      console.log(file);
    }
  }
};
</script>
